<script type="text/html" data-help-name="背景颜色">
    <p>清屏并设置屏幕背景</p>
</script>
  
  
<script type="text/html" data-template-name="背景颜色">
    <!-- 设置第一行为Name -->
    <div class="form-row">
      <label for="node-input-name"><i class="fa fa-tag"></i> 名称</label>
      <input type="text" id="node-input-name" data-i18n="[placeholder]name">
  </div>
  <!-- background color -->
  <div class="form-row">
    <label for="node-input-background_color"><i class="fa fa-circle"></i> 设置背景颜色</label>
    <select id="node-input-background_color" style="width: 250px;">
      <option value="#FF0000">红色</option>        <!-- red -->
      <option value="#00FF00">绿色</option>   <!-- green -->
      <option value="#0000FF">蓝色</option>    <!-- blue -->
      <option value="#FFFF00">黄色</option>  <!-- yellow -->
      <option value="#800080">紫色</option>  <!-- purple -->
      <option value="#00FFFF">青色</option>    <!-- cyan -->
      <option value="#FFA500">橙色</option>  <!-- orange -->
      <option value="#FFC0CB">粉红色</option>  <!-- pink -->
      <option value="#000000">黑色</option>   <!-- black -->
      <option value="#FFFFFF">白色</option>   <!-- white -->
      <option value="custom">自定义</option>
    </select>
  </div>
  <!-- 下拉选项框选择了自定义 -->
  <div class="form-row" id="node-set-state">
    <label for="node-input-custom_color">&nbsp;</label>
    <input type="text" id="node-input-custom_color" data-i18n="[placeholder]填写格式为#0099FF">
  </div>

  <div class="form-row" id="node-set-tick">
    <label>&nbsp;</label>
    <input type="checkbox" id="node-input-set" style="display: inline-block; width: auto; vertical-align: top;">
    <label for="node-input-set" style="width: 70%;">设置优先级: 默认优先级为6 </label>
  </div>
  <div class="form-row" id="node-set-state2">
    <label for="node-input-priority">&nbsp;</label>
    <select id="node-input-priority" style="width: 250px;">
      <option value="1">优先级1</option>
      <option value="2">优先级2</option>
      <option value="3">优先级3</option>
      <option value="4">优先级4</option>
      <option value="5">优先级5</option>
      <option value="6">优先级6</option>
      <option value="7">优先级7</option>
      <option value="8">优先级8</option>
      <option value="9">优先级9</option>
      <option value="10">优先级10</option>
    </select>
  </div>
  </script>
  

  
  <script type="text/javascript">
      RED.nodes.registerType('背景颜色',{
        category: 'Block LCD绘图',
        color: '#ffcb3c',
        defaults: {
          name: {value: ""},
          background_color: {value: "#FFFFFF"},
          custom_color: {value:""},
          priority: {value:"6"},
          set: {value:""}
        }, 
        inputs:1,
        outputs:0,
        icon: "font-awesome/fa-pencil",
        label: function() {
          return this.name||this._("清屏并设置屏幕背景");
        },



        oneditprepare: function() {
          var setstate = function () {
              // 判断选中的选项是否为"custom"
              if ($('#node-input-background_color').val() === "custom") {
                  $("#node-set-state").show();
              } else {
                  $("#node-set-state").hide();
              }
          };
          // 绑定下拉菜单的变化事件到setstate函数
          $("#node-input-background_color").change(function () { setstate(); });
          // 初始化时也调用一次以设置初始状态
          setstate();

          var setstate2 = function () {
            if ($('#node-input-set').is(":checked")) {
                $("#node-set-state2").show();
            } else {
                $("#node-set-state2").hide();
            }
          };
          $("#node-input-set").change(function () { setstate2(); });
          setstate2();
            
        }

      });
    </script>
    
